<code>
       <style type="text/css" title="currentStyle">
           @import "../css/ui-lightness/jquery-ui-1.7.2.custom.css";
           @import "../css/table/css/demo_table_jui.css";
           @import "../css/jquery.alerts.css";
         /*  @import "../css/layout.css";*/

        </style>
        <script type="text/javascript" language="javascript" src="../js/jquery-1.3.2.js"></script>
        <script type="text/javascript" language="javascript" src="../js/jquery.dataTables.js"></script>
        <script type="text/javascript" language="javascript" src="../js/jquery-ui-1.7.2.custom.min.js"></script>
        <script src="../js/jquery.alerts.js" type="text/javascript"></script>

        <script type="text/javascript" charset="utf-8">
            $(document).ready(function() {
                      var action;
                             $("#formDialog").dialog({
                            bgiframe: true,
                            autoOpen: false,
                            width:  430,
                            height: 320,
                            modal: true,
                            buttons: {
                                    'Aceptar': function() {
                                       
                                        $("#professorListBox").removeAttr("disabled");
                                        $("#subjectsListBox").removeAttr("disabled");
                                        $("#groupName").removeAttr("disabled");

                                       var valuesGroup=$("#modifyGroupForm").serialize();
                                       if(action=="m"){
                                            $.post("modifyGroup.do", valuesGroup, function(response){
                                            if(response=="success"){
                                             var groupName=$("#groupName").val();
                                                var selected;
                                                selected = $('input[name=state]:checked').val()
                                                $("#state_"+groupName).html ('<center>'+selected+'</center>');
                                                jAlert("Se modifico el grupo exitosamente", "Grupo")
                                            }else   jAlert(response, "Error");
                                        }, "html");
                                        }else{
                                               
                                               $.post("addGroup.do", valuesGroup, function(response){
                                                    if(response=="success"){

                                                    jAlert("Se agrego un grupo exitosamente", "Grupo");
                                                    setTimeout("window.location.reload()", 2000);

                                                    }else   jAlert(response, "Error");
                                                }, "html");

                                        }

                                        $(this).dialog('close');
                                    },
                                    Cancel: function() {
                                            $(this).dialog('close');
                                    }
                            }
                        });

                      $("a[href=#new]").click(function(){
                             action="a";
                              $.post("newGroup.do",function(page){
                                $('#formDialog').html(page);
                                 
                                $('#formDialog').dialog('open');
                            }, "html");
                        });

                     $("a[href=#modify]").click(function(){
                            var id_subject=$(this).attr("id");
                            action="m";
                             $.post("getGroup.do",{id:id_subject},function(page){
                                $('#formDialog').html(page);
                                $('#formDialog').dialog('open');
                            }, "html");
                        });

                      oTable = $('#groupList').dataTable({
					"bJQueryUI": true,
					"sPaginationType": "full_numbers",
                                        "aoColumns": [
                                            null,
                                            null,
                                            null,
                                            null,
                                           { "bSortable": false },

                                        ]
				});
			} );
		


		</script>

</code>
<%@ taglib uri="http://struts.apache.org/tags-bean" prefix="bean" %>
<%@ taglib uri="http://struts.apache.org/tags-html" prefix="html" %>
<%@ taglib uri="http://struts.apache.org/tags-logic" prefix="logic" %>

<logic:present name="groupList">
    <logic:present name="groupList">
<div class="demo_jui">
    
 <html:link href="#new"><bean:message key="label.group.new"/></html:link>
    <table cellpadding="0" cellspacing="0" border="0" class="display" id="groupList">
        <thead>
            <tr >
                <th><bean:message key="label.group.name"/></th>                
                <th><bean:message key="label.subject.name"/></th>
                <th><bean:message key="label.professor.name"/></th>
                <th><bean:message key="label.group.state"/></th>
                <th colspan="2"><bean:message key="label.subject.operation"/></th>
            </tr>
        </thead>
        <tbody id="tableBody">
            <logic:iterate id="result" name="groupList">
                <tr id="row_${result.groupName}">
                    <td id="id_${result.groupName}"><bean:write name="result" property="groupName" /></td>
                    <td><bean:write name="result" property="subjectName" /></td>
                    <td><bean:write name="result" property="professor_name" /></td>
                    <td id="state_${result.groupName}"><center><bean:write name="result" property="state" /></center></td>
                    <td><center><html:link href="#modify" styleId="${result.groupName}" ><bean:message key="label.button.modify"/></html:link></center></td>
                </tr>
            </logic:iterate>
        </tbody>
        <tfoot>
            <tr>
                <th><bean:message key="label.group.name"/></th>
                <th><bean:message key="label.subject.name"/></th>
                <th><bean:message key="label.professor.key"/></th>
                <th><bean:message key="label.group.state"/></th>
                <th colspan="2"><bean:message key="label.subject.operation"/></th>
            </tr>
        </tfoot>
    </table>
</div>
    </logic:present>
</logic:present>
<div id="formDialog">

</div>